<!DOCTYPE html>
<html lang="en">
	<head>
        <title>周易</title>
		<meta charset="UTF-8" />
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"/>
        <meta name="format-detection"content="telephone=no">
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <meta name="apple-mobile-web-app-status-bar-style" content="black" />
		<style>
			*{
				margin: 0;
				padding: 0;
			}
			.container{
				padding: 0 10px;
			}
			.headbar{
                background-color: bisque;
				width: 100%;
                text-align: center;
                height: 35px;
			}
			.gua-name{
				font-size: 38px;
                text-align: center;
			}
			.gua-content{
				align-self: center;
                font-size: 14px;
				margin-left: 16px;
			}
            .yao-item{
                display: flex;
                justify-content: space-between;
                width: 100%;
                border-radius: 2px;
                height: 21px;
                margin: 2px 0;
            }
			.yao-yang{
				background-color: red;
			}
			.yao-yin{
				background-color: white;
			}
			.yao-yin div{
				background-color: black;
				width: 42%;
			}
			.yao-content{
                font-size: 12px;
				padding-left: 5px;
			}
		</style>
		<script>
            var master = '7:7'
            var slave = '0:0'
			var dataList = [
                {
                    name: '乾',
                    code: '7:7',
                    content: '元，亨，利，贞',
					yaolist: ['潜龙勿用','见龙在田，利见大人','君子终日乾乾，夕惕若，厉，无咎','或跃在渊，无咎','飞龙在天，利见大人','亢龙有悔']
				},
				{
				    name: '坤',
				    code: '0:0',
				    content: '元亨，利牝马之贞。君子有攸往，先迷后得主，利；西南得朋，东北丧朋，安贞吉',
					yaolist: ['履霜，坚冰至','直方大，不习，无不利','含章可贞，或从王事，无成有终','括囊，无咎无誉','黄裳，元吉','龙战于野，其血玄黄']
				},
				{
				    name: '屯',
				    code: '2:1',
				    content: '元亨，利贞，勿用有攸往。利建侯',
					yaolist: ['磐桓，利居贞，利建侯','屯如，邅如，乘马班如。匪寇，婚媾。女子贞不字，十年乃字','即鹿无虞，惟入于林中；君子几不如舍。往吝','乘马班如，求婚媾；往吉，无不利','屯其膏，小贞吉，大贞凶','乘马班如，泣血涟如']
				},
				{
				    name: '蒙',
				    code: '4:2',
				    content: '亨。匪我求童蒙，童蒙求我。初筮告，再三渎，渎则不告，利贞',
					yaolist: ['发蒙，利用刑人，用说桎梏，以往吝','包蒙，吉。纳妇吉，子克家','勿用取女，见金夫，不有躬，无攸利','困蒙，吝','童蒙，吉','击蒙，不利为寇，利御寇']
				},
                {
                    name: '需',
                    code: '2:7',
                    content: '有孚，光亨，贞吉，利涉大川',
                	yaolist: ['需于郊，利用恒，无咎','需于沙，小有言，终吉','需于泥，致寇至','需于血，出自穴','需于酒食，贞吉','入于穴，有不速之客三人来，敬之终吉']
                },
                {
                    name: '讼',
                    code: '7:2',
                    content: '有孚，窒惕，中吉，终凶。利见大人，不利涉大川',
                	yaolist: ['不永所事，小有言，终吉','不克讼，归而逋。其邑人三百户，无眚','食旧德，贞厉，终吉。或从王事，无成','不克讼，复既命，渝。安贞，吉','讼元吉','或锡之鞶带，终朝三褫之']
                },
                {
                    name: '师',
                    code: '0:2',
                    content: '贞，丈人吉，无咎',
                	yaolist: ['师出以律，否臧凶','在师中，吉，无咎；王三锡命','师或舆尸,凶','师左次，无咎','田有禽，利执言，无咎。长子帅师，弟子舆尸，贞凶','大君有命，开国承家,小人勿用']
                },
                {
                    name: '比',
                    code: '2:0',
                    content: '比，吉。原筮，元永贞，无咎。不宁方来，后夫凶',
                	yaolist: ['有孚比之，无咎。有孚盈缶，终来有它，吉','比之自内，贞吉','比之匪人','外比之，贞吉','显比，王用三驱，失前禽。邑人不诫，吉','比之无首，凶']
                },
                {
                    name: '小畜',
                    code: '6:7',
                    content: '亨。密云不雨，自我西郊',
                	yaolist: ['复自道，何其咎？吉','牵复，吉','舆说辐，夫妻反目','有孚，血去惕出，无咎','有孚挛如，富以其邻','既雨既处，尚德载。妇贞厉，月几望，君子征凶']
                },
                {
                    name: '履',
                    code: '7:3',
                    content: '履虎尾，不咥人。亨',
                	yaolist: ['素履往，无咎','履道坦坦，幽人贞吉','眇能视，跛能履。履虎尾，咥人，凶。武人为于大君','履虎尾，愬愬。终吉','夬履，贞厉','视履，考祥其旋。元吉']
                },
                {
                    name: '泰',
                    code: '0:7',
                    content: '小往大来，吉，亨',
                	yaolist: ['拔茅茹，以其汇，征吉','包荒，用冯河，不遐遗；朋亡，得尚于中行','无平不陂，无往不复；艰贞无咎，勿恤其孚，于食有福','翩翩，不富以其邻，不戒以孚','帝乙归妹，以祉元吉','城复于隍；勿用师，自邑告命，贞吝']
                },
                {
                    name: '否',
                    code: '7:0',
                    content: '否之匪人，不利君子贞，大往小来',
                	yaolist: ['拔茅茹，以其汇，贞吉，亨','包承，小人吉；大人否，亨','包羞','有命无咎，畴离祉','休否，大人吉；其亡其亡，系于苞桑','倾否；先否后喜']
                },
                {
                    name: '同人',
                    code: '7:5',
                    content: '同人于野，亨',
                	yaolist: ['同人于门，无咎','同人于宗，吝','伏戎于莽，升其高陵，三岁不兴','乘其墉，弗克攻，吉','同人，先号啕，而后笑，大师克相遇','同人于郊，无悔']
                },
                {
                    name: '大有',
                    code: '5:7',
                    content: '元亨',
                	yaolist: ['无交害，匪咎，艰则无咎','大车以载，有攸往，无咎','公用亨于天子，小人弗克','匪其彭，无咎。象曰：匪其彭，无咎；明辨晰也','厥孚交如，威如；吉','自天佑之，吉无不利']
                },
                {
                    name: '谦',
                    code: '0:4',
                    content: '亨，君子有终',
                	yaolist: ['谦谦君子，用涉大川，吉','鸣谦，贞吉','劳谦，君子有终，吉','无不利，撝谦','不富以其邻，利用侵伐，无不利','鸣谦，利用行师征邑国']
                },
                {
                    name: '豫',
                    code: '1:0',
                    content: '利建侯、行师',
                	yaolist: ['鸣豫，凶','介于石，不终日，贞吉','盱豫悔，迟有悔','由豫，大有得；勿疑，朋盍簪','贞疾，恒不死','冥豫成，有渝无咎']
                },
                {
                    name: '随',
                    code: '3:1',
                    content: '元亨利贞，无咎',
                	yaolist: ['官有渝，贞吉。出门交有功','系小子，失丈夫','系丈夫，失小子','随有获，贞凶。有孚在道，以明，何咎','孚于嘉，吉','拘系之，乃从维之。王用亨于西山']
                },
                {
                    name: '蛊',
                    code: '4:6',
                    content: '元亨，利涉大川。先甲三日，后甲三日',
                	yaolist: ['干父之蛊，有子，考无咎，厉终吉','干母之蛊，不可贞','干父小有晦，无大咎','裕父之蛊，往见吝','干父之蛊，用誉','不事王侯，高尚其事']
                },
                {
                    name: '临',
                    code: '0:3',
                    content: '元，亨，利，贞。至于八月有凶',
                	yaolist: ['咸临，贞吉','咸临，吉无不利','甘临，无攸利。既忧之，无咎','至临，无咎','知临，大君之宜，吉','敦临，吉无咎']
                },
                {
                    name: '观',
                    code: '6:0',
                    content: '盥而不荐，有顒孚若',
                	yaolist: ['童观，小人无咎，君子吝','窥观，利女贞','观我生，进退','观国之光，利用宾于王','观我生，君子无咎','观其生，君子无咎']
                },
                {
                    name: '噬嗑',
                    code: '5:1',
                    content: '亨。利用狱',
                	yaolist: ['屦校灭趾，无咎','噬肤灭鼻','噬腊肉，遇毒;小吝，无咎','噬乾胏，得金矢，利艰贞，吉','噬乾肉，得黄金，贞厉，无咎','何校灭耳，凶']
                },
                {
                    name: '贲',
                    code: '4:5',
                    content: '亨。小利有所往',
                	yaolist: ['贲其趾，舍车而徒','贲其须','贲如濡如，永贞吉','贲如皤如，白马翰如，匪寇婚媾','贲于丘园，束帛戋戋，吝，终吉','白贲，无咎']
                },
                {
                    name: '剥',
                    code: '4:0',
                    content: '不利有攸往',
                	yaolist: ['剥床以足，蔑贞凶','剥床以辨，蔑贞凶','剥之，无咎','剥床以肤','贯鱼，以宫人宠，无不利','硕果不食，君子得舆，小人剥庐']
                },
                {
                    name: '复',
                    code: '0:1',
                    content: '亨。出入无疾，朋来无咎。反复其道，七日来复，利有攸往',
                	yaolist: ['不复远，无祗悔，元吉','休复，吉','频复，厉无咎','中行独复','敦复，无悔','迷复，凶，有灾眚。用行师，终有大败，以其国君，凶;至于十年，不克征']
                },
                {
                    name: '无妄',
                    code: '7:1',
                    content: '元，亨，利，贞。其匪正有眚，不利有攸往',
                	yaolist: ['无妄，往吉','不耕获，不菑畲，则利有攸往','无妄之灾，或系之牛，行人之得，邑人之灾','可贞，无咎','无妄之疾，勿药有喜','无妄，行有眚，无攸利']
                },
                {
                    name: '大畜',
                    code: '4:7',
                    content: '利贞，不家食吉，利涉大川',
                	yaolist: ['有厉利已','舆说辐','良马逐，利艰贞。曰闲舆卫，利有攸往','童豕之牿，元吉','豶豕之牙，吉','何天之衢，亨']
                },
                {
                    name: '颐',
                    code: '4:1',
                    content: '贞吉。观颐，自求口实',
                	yaolist: ['舍尔灵龟，观我朵颐，凶','颠颐，拂经，于丘颐，征凶','拂颐，贞凶，十年勿用，无攸利','颠颐吉，虎视眈眈，其欲逐逐，无咎','拂经，居贞吉，不可涉大川','由颐，厉吉，利涉大川']
                },
                {
                    name: '大过',
                    code: '3:6',
                    content: '栋桡，利有攸往，亨',
                	yaolist: ['藉用白茅，无咎','枯杨生稊，老夫得其女妻，无不利','栋桡，凶','栋隆，吉;有它吝','枯杨生华，老妇得士夫，无咎无誉','过涉灭顶，凶，无咎']
                },
                {
                    name: '坎',
                    code: '2:2',
                    content: '习坎，有孚，维心，亨，行有尚',
                	yaolist: ['习坎，入于坎窞，凶','坎有险，求小得','来之坎坎，险且枕，入于坎窞，勿用','樽酒簋贰，用缶，纳约自牖，终无咎','坎不盈，祗既平，无咎','用徽繹，置于丛棘，三岁不得，凶']
                },
                {
                    name: '离',
                    code: '5:5',
                    content: '利贞，亨。畜牝牛，吉',
                	yaolist: ['履错然，敬之无咎','黄离，元吉','日昃之离，不鼓缶而歌，则大耋之嗟，凶','突如其来如，焚如，死如，弃如','出涕沱若，戚嗟若，吉','王用出征，有嘉折首，获其匪丑，无咎']
                },
                {
                    name: '咸',
                    code: '3:4',
                    content: '亨，利贞，取女吉',
                	yaolist: ['咸其拇','咸其腓，凶，居吉','咸其股，执其随，往吝','贞吉悔亡，憧憧往来，朋从尔思','咸其脢，无悔','咸其辅，颊，舌']
                },
                {
                    name: '恒',
                    code: '1:6',
                    content: '亨，无咎，利贞，利有攸往',
                	yaolist: ['浚恒，贞凶，无攸利','悔亡','不恒其德，或承之羞，贞吝','田无禽','恒其德，贞，妇人吉，夫子凶','振恒，凶']
                },
                {
                    name: '遁',
                    code: '7:4',
                    content: '亨，小利贞',
                	yaolist: ['遁尾，厉，勿用有攸往','执之用黄牛之革，莫之胜说','系遁，有疾厉，畜臣妾吉','好遁君子吉，小人否','嘉遁，贞吉','肥遁，无不利']
                },
                {
                    name: '大壮',
                    code: '1:7',
                    content: '利贞',
                	yaolist: ['壮于趾，征凶，有孚','贞吉','小人用壮，君子用罔，贞厉。羝羊触藩，羸其角','贞吉悔亡，藩决不羸，壮于大舆之輹','丧羊于易，无悔','羝羊触藩，不能退，不能遂，无攸利，艰则吉']
                },
                {
                    name: '晋',
                    code: '5:0',
                    content: '康侯用锡马蕃庶，昼日三接',
                	yaolist: ['晋如，摧如，贞吉。罔孚，裕无咎','晋如，愁如，贞吉。受兹介福，于其王母','众允，悔亡','晋如硕鼠，贞厉','悔亡，失得勿恤，往吉无不利','晋其角，维用伐邑，厉吉无咎，贞吝']
                },
                {
                    name: '明夷',
                    code: '0:5',
                    content: '利艰贞',
                	yaolist: ['明夷于飞，垂其翼','明夷，夷于左股，用拯马壮，吉','明夷于南狩，得其大首，不可疾贞','入于左腹，获明夷之心，出于门庭','箕子之明夷，利贞','不明晦，初登于天，后入于地']
                },
                {
                    name: '家人',
                    code: '6:5',
                    content: '利女贞',
                	yaolist: ['闲有家，悔亡','无攸遂，在中馈，贞吉','家人嗃嗃，悔厉吉;妇子嘻嘻，终吝','富家，大吉','王假有家，勿恤吉','有孚威如，终吉']
                },
                {
                    name: '睽',
                    code: '5:3',
                    content: '小事吉',
                	yaolist: ['悔亡，丧马勿逐，自复;见恶人无咎','遇主于巷，无咎','见舆曳，其牛掣，其人天且劓，无初有终','睽孤，遇元夫，交孚，厉无咎','悔亡，厥宗噬肤，往何咎','睽孤，见豕负涂，载鬼一车，先张之弧，后说之弧，匪寇婚媾，往遇雨则吉']
                },
                {
                    name: '蹇',
                    code: '2:4',
                    content: '利西南，不利东北;利见大人，贞吉',
                	yaolist: ['往蹇，来誉','王臣蹇蹇，匪躬之故','往蹇来反','往蹇来连','大蹇朋来','往蹇来硕，吉;利见大人']
                },
                {
                    name: '解',
                    code: '1:2',
                    content: '利西南，无所往，其来复吉。有攸往，夙吉',
                	yaolist: ['无咎','田获三狐，得黄矢，贞吉','负且乘，致寇至，贞吝','解而拇，朋至斯孚','君子维有解，吉;有孚于小人','公用射隼，于高墉之上，获之，无不利']
                },
                {
                    name: '损',
                    code: '4:3',
                    content: '有孚，元吉，无咎，可贞，利有攸往。曷之用，二簋可用享',
                	yaolist: ['已事遄往，无咎，酌损之','利贞，征凶，弗损益之','三人行，则损一人;一人行，则得其友','损其疾，使遄有喜，无咎','或益之，十朋之龟弗克违，元吉','弗损益之，无咎，贞吉，利有攸往，得臣无家']
                },
                {
                    name: '益',
                    code: '6:1',
                    content: '利有攸往，利涉大川',
                	yaolist: ['利用为大作，元吉，无咎','或益之，十朋之龟弗克违，永贞吉。王用享于帝，吉','益之用凶事，无咎。有孚中行，告公用圭','中行，告公从。利用为依迁国','有孚惠心，勿问元吉。有孚惠我德','莫益之，或击之，立心勿恒，凶']
                },
                {
                    name: '夬',
                    code: '3:7',
                    content: '扬于王庭，孚号，有厉，告自邑，不利即戎，利有攸往',
                	yaolist: ['壮于前趾，往不胜为吝','惕号，莫夜有戎，勿恤','壮于，有凶。君子夬夬，独行遇雨，若濡有愠，无咎','臀无肤，其行次且。牵羊悔亡，闻言不信','苋陆夬夬，中行无咎','无号，终有凶']
                },
                {
                    name: '姤',
                    code: '7:6',
                    content: '女壮，勿用取女',
                	yaolist: ['系于金柅，贞吉，有攸往，见凶，羸豕踟躅','包有鱼，无咎，不利宾','臀无肤，其行次且，厉，无大咎','包无鱼，起凶','以杞包瓜，含章，有陨自天','姤其角，吝，无咎']
                },
                {
                    name: '萃',
                    code: '3:0',
                    content: '亨。王假有庙，利见大人，亨，利贞。用大牲吉，利有攸往',
                	yaolist: ['有孚不终，乃乱乃萃，若号一握 为笑，勿恤，往无咎','引吉，无咎，孚乃利用禴','萃如，嗟如，无攸利，往无咎，小吝','大吉，无咎','萃有位，无咎。匪孚，元永贞，悔亡','赍咨涕洟，无咎']
                },
                {
                    name: '升',
                    code: '0:6',
                    content: '元亨，用见大人，勿恤，南征吉',
                	yaolist: ['允升，大吉','孚乃利用禴，无咎','升虚邑','王用亨于岐山，吉无咎','贞吉，升阶','冥升，利于不息之贞']
                },
                {
                    name: '困',
                    code: '3:2',
                    content: '亨，贞，大人吉，无咎，有言不信',
                	yaolist: ['臀困于株木，入于幽谷，三岁不见','困于酒食，朱绂方来，利用亨祀，征凶，无咎','困于石，据于蒺藜，入于其宫，不见其妻，凶','来徐徐，困于金车，吝，有终','劓刖，困于赤绂，乃徐有说，利用祭祀','困于葛藟，于臲卼，曰动悔。有悔，征吉']
                },
                {
                    name: '井',
                    code: '2:6',
                    content: '改邑不改井，无丧无得，往来井井。汔至，亦未繘井，羸其瓶，凶',
                	yaolist: ['井泥不食，旧井无禽','井谷射鲋，瓮敝漏','井渫不食，为我民恻，可用汲，王明，并受其福','井甃，无咎','井冽，寒泉食','井收勿幕，有孚无吉']
                },
                {
                    name: '革',
                    code: '3:5',
                    content: '己日乃孚，元亨利贞，悔亡',
                	yaolist: ['巩用黄牛之革','己日乃革之，征吉，无咎','征凶，贞厉，革言三就，有孚','悔亡，有孚改命，吉','大人虎变，未占有孚','君子豹变，小人革面，征凶，居贞吉']
                },
                {
                    name: '鼎',
                    code: '5:6',
                    content: '元吉，亨',
                	yaolist: ['鼎颠趾，利出否，得妾以其子，无咎','鼎有实，我仇有疾，不我能即，吉','鼎耳革，其行塞，雉膏不食，方雨亏悔，终吉','鼎折足，覆公鋉，其形渥，凶','鼎黄耳金铉，利贞','鼎玉铉，大吉，无不利']
                },
                {
                    name: '震',
                    code: '1:1',
                    content: '亨。震来虩虩，笑言哑哑。震惊百里，不丧匕鬯',
                	yaolist: ['震来虩虩，后笑言哑哑，吉','震来厉，亿丧贝，跻于九陵，勿逐，七日得','震苏苏，震行无眚','震遂泥','震往来厉，亿无丧，有事','震索索，视矍矍，征凶。震不于其躬，于其邻，无咎。婚媾有言']
                },
                {
                    name: '艮',
                    code: '4:4',
                    content: '艮其背，不获其身，行其庭，不见其人，无咎',
                	yaolist: ['艮其趾，无咎，利永贞','艮其腓，不拯其随，其心不快','艮其限，列其夤，厉薰心','艮其身，无咎','艮其辅，言有序，悔亡','敦艮，吉']
                },
                {
                    name: '渐',
                    code: '6:4',
                    content: '女归吉，利贞',
                	yaolist: ['鸿渐于干，小子厉，有言，无咎','鸿渐于磐，饮食衍衍，吉','鸿渐于陆，夫征不复，妇孕不育，凶;利御寇','鸿渐于木，或得其桷，无咎','鸿渐于陵，妇三岁不孕，终莫之胜，吉','鸿渐于逵，其羽可用为仪，吉']
                },
                {
                    name: '归妹',
                    code: '1:3',
                    content: '征凶，无攸利',
                	yaolist: ['归妹以娣，跛能履，征吉','眇能视，利幽人之贞','归妹以须，反归以娣','归妹愆期，迟归有时','帝乙归妹，其君之袂，不如其娣之袂良，月几望，吉','女承筐无实，士刲羊无血，无攸利']
                },
                {
                    name: '丰',
                    code: '1:5',
                    content: '亨，王假之，勿忧，宜日中',
                	yaolist: ['遇其配主，虽旬无咎，往有尚','丰其蔀，日中见斗，往得疑疾，有孚发若，吉','丰其沛，日中见昧，折其右肱，无咎','丰其蔀，日中见斗，遇其夷主，吉','来章，有庆誉，吉','丰其屋，蔀其家，窥其户，阒其无人，三岁不见，凶']
                },
                {
                    name: '旅',
                    code: '5:4',
                    content: '小亨，旅贞吉',
                	yaolist: ['旅琐琐，斯其所取灾','旅即次，怀其资，得童仆贞','旅焚其次，丧其童仆，贞厉','旅于处，得其资斧，我心不快','射雉一矢亡，终以誉命','鸟焚其巢，旅人先笑后号啕。丧牛于易，凶']
                },
                {
                    name: '巽',
                    code: '6:6',
                    content: '小亨，利攸往，利见大人',
                	yaolist: ['进退，利武人之贞','巽在床下。用史巫纷若，吉无咎','频巽，吝','悔亡，田获三品','贞吉悔亡，无不利。无初有终，先庚三日，后庚三日，吉','巽在床下，丧其资斧，贞凶']
                },
                {
                    name: '兑',
                    code: '3:3',
                    content: '亨，利贞',
                	yaolist: ['和兑，吉','孚兑，吉','来兑，凶','商兑，未宁，介疾有喜','孚于剥，有厉','引兑']
                },
                {
                    name: '涣',
                    code: '6:2',
                    content: '亨。王假有庙，利涉大川，利贞',
                	yaolist: ['用拯马壮，吉','涣奔其机，悔亡','涣其躬，无悔','涣其群，元吉。涣有丘，匪夷所思','涣汗其大号，涣王居，无咎','涣其血，去逖出，无咎']
                },
                {
                    name: '节',
                    code: '2:3',
                    content: '亨。苦节不可贞',
                	yaolist: ['不出户庭，无咎','不出门庭，凶','不节若，则嗟若，无咎','安节，亨','甘节，吉;往有尚','苦节，贞凶，悔亡']
                },
                {
                    name: '中孚',
                    code: '6:3',
                    content: '豚鱼吉，利涉大川，利贞',
                	yaolist: ['虞吉，有他不燕','鸣鹤在阴，其子和之，我有好爵，吾与尔靡之','得敌，或鼓或罢，或泣或歌','月几望，马匹亡，无咎','有孚挛如，无咎','翰音登于天，贞凶']
                },
                {
                    name: '小过',
                    code: '1:4',
                    content: '亨，利贞，可小事，不可大事。飞鸟遗之音，不宜上宜下，大吉',
                	yaolist: ['飞鸟以凶','过其祖，遇其妣;不及其君，遇其臣;无咎','弗过防之，从或戕之，凶','无咎，弗过遇之。往厉必戒，勿用永贞','密云不雨，自我西郊，公弋取彼在穴','弗遇过之，飞鸟离之，凶，是谓灾眚']
                },
                {
                    name: '既济',
                    code: '2:5',
                    content: '亨，小利贞，初吉终乱',
                	yaolist: ['曳其轮，濡其尾，无咎','妇丧其茀，勿逐，七日得','高宗伐鬼方，三年克之，小人勿用','繻有衣袽，终日戒','东邻杀牛，不如西邻之禴祭，实受其福','濡其首，厉']
                },
                {
                    name: '未济',
                    code: '5:2',
                    content: '亨，小狐汔济，濡其尾，无攸利',
                	yaolist: ['濡其尾，吝','曳其轮，贞吉','未济，征凶，利涉大川','贞吉，悔亡，震用伐鬼方，三年有赏于大国','贞吉，无悔，君子之光，有孚，吉','有孚于饮酒，无咎，濡其首，有孚失是']
                }
			]
            
            function find(code) {
                for(var i in dataList) {
                    var e = dataList[i]
                    if(e.code == code) return e
                }
                
                return null
            }
            
            function convert(code) {
                var items = code.split(':')
                var up = parseInt(items[0])
                var down = parseInt(items[1])
                
                var mode6 = up
                var pos6 = parseInt(mode6 / 4)
                var mode5 = mode6 % 4
                var pos5 = parseInt(mode5 / 2)
                var mode4 = mode5 % 2
                
                var mode3 = down
                var pos3 = parseInt(mode3 / 4)
                var mode2 = mode3 % 4
                var pos2 = parseInt(mode2 / 2)
                var mode1 = mode2 % 2
                
                return [mode1, pos2, pos3, mode4, pos5, pos6]
            }
            
            function reconvert(arr) {
                var up = arr[5] * 4 + arr[4] * 2 + arr[3]
                var down = arr[2] * 4 + arr[1] * 2 + arr[0]
                return up + ':' + down
            }
            
            function zong(code) {//综
                var a = convert(code)
                var code2 = reconvert([a[5],a[4],a[3],a[2],a[1],a[0]])
                return find(code2)
            }
            
            function stagger(code) {//错
                var a = convert(code)
                var ret = []
                for(var i in a) {
                    ret.push(a[i] == 0? 1: 0)
                }
                
                var code2 = reconvert(ret)
                return find(code2)
            }
            
            function across(code) {//交
                var a = convert(code)
                var code2 = reconvert([a[3],a[4],a[5],a[0],a[1],a[2]])
                return find(code2)
            }
            
            function hu(code) {//互
                var a = convert(code)
                var code2 = reconvert([a[1],a[2],a[3],a[2],a[3],a[4]])
                return find(code2)
            }
            
			function onChange(e) {
                var guaData = find(e.value)
                refresh(1, guaData)
                
                refresh(2, zong(guaData.code))
			}
            
            function onChange2(e) {
                var value = parseInt(e.value)
                if(value == 1) { //综
                    refresh(2, zong(master))
                } else if(value == 2) {//错
                    refresh(2, stagger(master))
                } else if(value == 3) {//交
                    refresh(2, across(master))
                } else {//互
                    refresh(2, hu(master))
                }
            }
			
			function refresh(seq, guaData) {
                if(seq == 1) {
                    master = guaData.code
                } else {
                    slave = guaData.code
                }
                
				var gua = document.getElementById('gua_' + seq)
				gua.getElementsByClassName('gua-name')[0].innerHTML = guaData.name
				gua.getElementsByClassName('gua-content')[0].innerHTML = guaData.content
				
                var types = convert(guaData.code)
				var yaoList = Array.from(gua.getElementsByClassName('yao'))
				for(var i in yaoList) {
					var e = yaoList[5 - i]
					var yaoItem = e.getElementsByClassName('yao-item')[0]
					yaoItem.classList.remove('yao-yang')
					yaoItem.classList.remove('yao-yin')
					
					var content = guaData.yaolist[i]                    
					yaoItem.classList.add(types[i] == 0? 'yao-yin': 'yao-yang')
					e.getElementsByClassName('yao-content')[0].innerHTML = content
				}
			}
            
            function random() {
                var index = Math.floor(Math.random() * dataList.length)
                var data = dataList[index]
                while(data.code == master) {
                    index = Math.floor(Math.random() * dataList.length)
                    data = dataList[index]
                }
                refresh(1, data)
                refresh(2, zong(master))
            }
            
            function reverse() {
                master = slave
                refresh(1, find(master))
                refresh(2, zong(master))
            }
            
            window.onload = function() {
                refresh(1, find(master))
                refresh(2, find(slave))
            }
		</script>
	</head>
	<body>
        <table class="headbar">
            <tr>
                <td>
                    <select onchange="onChange(this)" style="width: 20vw;">
                    	<option value="7:7">乾</option>
                    	<option value="0:0">坤</option>
                    	<option value="2:1">屯</option>
                        <option value="4:2">蒙</option>
                        <option value="2:7">需</option>
                        <option value="7:2">讼</option>
                        <option value="0:2">师</option>
                        <option value="2:0">比</option>
                        <option value="6:7">小畜</option>
                        <option value="7:3">履</option>
                        <option value="0:7">泰</option>
                        <option value="7:0">否</option>
                        <option value="7:5">同人</option>
                        <option value="5:7">大有</option>
                        <option value="0:4">谦</option>
                        <option value="1:0">豫</option>
                        <option value="3:1">随</option>
                        <option value="4:6">蛊</option>
                        <option value="0:3">临</option>
                        <option value="6:0">观</option>
                        <option value="5:1">噬嗑</option>
                        <option value="4:5">贲</option>
                        <option value="4:0">剥</option>
                        <option value="0:1">复</option>
                        <option value="7:1">无妄</option>
                        <option value="4:7">大畜</option>
                        <option value="4:1">颐</option>
                        <option value="3:6">大过</option>
                        <option value="2:2">坎</option>
                        <option value="5:5">离</option>
                        <option value="3:4">咸</option>
                        <option value="1:6">恒</option>
                        <option value="7:4">遁</option>
                        <option value="1:7">大壮</option>
                        <option value="5:0">晋</option>
                        <option value="0:5">明夷</option>
                        <option value="6:5">家人</option>
                        <option value="5:3">睽</option>
                        <option value="2:4">蹇</option>
                        <option value="1:2">解</option>
                        <option value="4:3">损</option>
                        <option value="6:1">益</option>
                        <option value="3:7">夬</option>
                        <option value="7:6">姤</option>
                        <option value="3:0">萃</option>
                        <option value="0:6">升</option>
                        <option value="3:2">困</option>
                        <option value="2:6">井</option>
                        <option value="3:5">革</option>
                        <option value="5:6">鼎</option>
                        <option value="1:1">震</option>
                        <option value="4:4">艮</option>
                        <option value="6:4">渐</option>
                        <option value="1:3">归妹</option>
                        <option value="1:5">丰</option>
                        <option value="5:4">旅</option>
                        <option value="6:6">巽</option>
                        <option value="3:3">兑</option>
                        <option value="6:2">涣</option>
                        <option value="2:3">节</option>
                        <option value="6:3">中孚</option>
                        <option value="1:4">小过</option>
                        <option value="2:5">既济</option>
                        <option value="5:2">未济</option>
                    </select>
                </td>
                <td>
                    <button style="width: 20vw;" onclick="random()">随机</button>
                </td>
                <td>
                    <select onchange="onChange2(this)" style="width: 20vw;">
                        <option value="1">综</option>
                        <option value="2">错</option>
                        <option value="3">交</option>
                        <option value="4">互</option>
                    </select>
                </td>
                <td><button style="width: 20vw;" onclick="reverse()">反客为主</button></td>
            </tr>
        </table>
		<div class="container">
            <table id="gua_1" style="width: 100%;margin-bottom: 5px;">
                <tr>
                    <td class="gua-name"></td>
                    <td class="gua-content"></td>
                </tr>
                <tr class="yao">
                    <td style="width: 25vw;">
                        <div class="yao-item yao-yang">
                            <div></div>
                            <div></div>
                        </div>
                    </td>
                    <td class="yao-content"></td>
                </tr>
                <tr class="yao">
                    <td>
                        <div class="yao-item yao-yin">
                            <div></div>
                            <div></div>
                        </div>
                    </td>
                    <td class="yao-content"></td>
                </tr>
                <tr class="yao">
                    <td>
                        <div class="yao-item yao-yin">
                            <div></div>
                            <div></div>
                        </div>
                    </td>
                    <td class="yao-content"></td>
                </tr>
                <tr class="yao">
                    <td>
                        <div class="yao-item yao-yin">
                            <div></div>
                            <div></div>
                        </div>
                    </td>
                    <td class="yao-content"></td>
                </tr>
                <tr class="yao">
                    <td>
                        <div class="yao-item yao-yin">
                            <div></div>
                            <div></div>
                        </div>
                    </td>
                    <td class="yao-content"></td>
                </tr>
                <tr class="yao">
                    <td>
                        <div class="yao-item yao-yin">
                            <div></div>
                            <div></div>
                        </div>
                    </td>
                    <td class="yao-content"></td>
                </tr>
            </table>
			<hr />
            <table id="gua_2" style="width: 100%;margin-bottom: 5px;">
                <tr>
                    <td class="gua-name"></td>
                    <td class="gua-content"></td>
                </tr>
                <tr class="yao">
                    <td style="width: 25vw;">
                        <div class="yao-item yao-yang">
                            <div></div>
                            <div></div>
                        </div>
                    </td>
                    <td class="yao-content"></td>
                </tr>
                <tr class="yao">
                    <td>
                        <div class="yao-item yao-yin">
                            <div></div>
                            <div></div>
                        </div>
                    </td>
                    <td class="yao-content"></td>
                </tr>
                <tr class="yao">
                    <td>
                        <div class="yao-item yao-yin">
                            <div></div>
                            <div></div>
                        </div>
                    </td>
                    <td class="yao-content"></td>
                </tr>
                <tr class="yao">
                    <td>
                        <div class="yao-item yao-yin">
                            <div></div>
                            <div></div>
                        </div>
                    </td>
                    <td class="yao-content"></td>
                </tr>
                <tr class="yao">
                    <td>
                        <div class="yao-item yao-yin">
                            <div></div>
                            <div></div>
                        </div>
                    </td>
                    <td class="yao-content"></td>
                </tr>
                <tr class="yao">
                    <td>
                        <div class="yao-item yao-yin">
                            <div></div>
                            <div></div>
                        </div>
                    </td>
                    <td class="yao-content"></td>
                </tr>
            </table>
		</div>
	</body>
</html>